<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">
<section class="content-header">
    <h1 style="display: inline-block" id="title">外购件出库单</h1>
    <button onclick="javascript:window.history.back();" type="button" class="btn btn-success"
            style="text-align:center;vertical-align:middle;font-size:30px;position:absolute;right:3%;display: inline-block;background-color: transparent;border: none;color: #5c5c5c;outline:none;">
        <i style="-moz-transform:scaleX(-1);-webkit-transform:scaleX(-1);-o-transform:scaleX(-1);transform:scaleX(-1);filter:FlipH;"
           class="glyphicon glyphicon-share-alt"></i><span
            style="margin-left: 5px;font-size: 16px;position: absolute;top: 20%;">返回</span>
    </button>
</section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <div class="row">
                        <div class="form-inline">
                            <form id="queryForm">
                                <input type="hidden" id="odrId" name="odrId" th:value="${odrId}">
                                <!--<div class="form-group">
                                    <label>
                                        领料人
                                    </label>
                                    <input name="odrTakePerson" type="text" class="form-control text" maxlength="6"
                                           placeholder="请输入领料人"/>
                                </div>-->
                                <div class="form-group">
                                    <label>
                                        出库日期
                                    </label>
                                    <input type="text" class="form-control datepicker" id="odrDate"
                                           name="odrDate" readonly="readonly" th:value="${odrDate}"/>
                                </div>
                                <div class="form-group">
                                    <label>
                                        摘要
                                    </label>
                                    <input name="odrRemark" type="text" class="form-control text" maxlength="255"
                                           placeholder="请输入摘要"/>
                                </div>
                                <!--<div class="form-group">
                                    <label>
                                        出库车间
                                    </label>
                                    <select id="odrDept" name="odrDept" class="form-control select2">
                                        <option value="">请选择</option>
                                        <option th:each="type:${dept}" th:value="${type.depId}"
                                                th:text="${type.depName}"></option>
                                    </select>
                                </div>-->
                                <div class="form-group">
                                    <label>
                                        制单人
                                    </label>
                                    <input name="odrMakePersonId" type="text" class="form-control text" maxlength="255"
                                           placeholder="请输入制单人" readonly="readonly" th:value="${odrMakePerson}"/>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

                <div class="box-body">
                    <table id="bootstrap-table" class="table table-bordered " width="100%">
                    </table>
                </div>
                <div>
                    <button type="button" class="btn btn-info pull-right"
                            id="btn-save">
                        保存
                    </button>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    var table;

    $(function () {
        var a = $("#odrId").val();
        //加载列表数据
        table = js.table.init({
            id: 'bootstrap-table',
            url: ctx + "allocationOutWar/detailList",
            data:{
                odrId:$("#odrId").val()
            },
            showColumns: true,
            showExport: false,
            pageSize: 300,
            striped: false,
            columns: [
                {
                    title: '序号', field: 'ardId', width: '40',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {title: 'SAP物料编码', field: 'ardSapCode'},
                {title: '物料描述', field: 'ardMatName'},
                {title: '数量', field: 'ardOutNum'},
                {title: '单位', field: 'ardUnit'},
                {title: '单价', field: 'ardPrice'},
                {title: '跟踪号', field: 'ardTrackCode'},
                {title: '项目编号', field: 'ardProCode'},
                {title: '项目名称', field: 'ardProName'},
                {title: '库位', field: 'odrOutWhiName'},
                {title: '区位', field: 'ardProName'},
                {title: '在库类型', field: 'ardStockType',
                    formatter: function (value, row, index) {
                        if(value == 1){
                            return "库存在库"
                        }else if(value==2){
                            return "项目在库"
                        }else {
                            return value
                        }
                    }},
                {title: '特殊说明', field: 'ardSpecialRemark'}
            ]
        });
        /**
         * 创建调拨单保存
         */
        $("#btn-save").on('click', function () {
            js.submit({
                url: ctx + "allocationOutWar/saveAllocationOutWar",
                data: new FormData($("#queryForm")[0]),
                success: function (result) {
                    if (result.data.message == "单据保存成功！") {
                    //js.modal.success("操作成功");
                    //js.table.refresh(table);
                        //alert("保存成功！");
                        location.href="/allocationOutWar/page";
                } else {
                    js.modal.warning(result.data);
                    js.table.refresh(table);
                }
                    js.modal.closeLoading();
                }
            })
        });
    });
</script>
</body>
</html>
